<template>
  <div>
    <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
      <div class="widget am-cf">
        <div class="widget-head am-cf">
          <div class="widget-title am-fl">短信设置</div>
        </div>
        <div class="widget-body  am-fr">
          <customer-toolbar ref="toolbar"  class="toolbar" @search="handleFind"
                            areaTeam campusTeam
          ></customer-toolbar>
          <div class="am-u-sm-12 am-u-md-12 am-u-lg-3 am-form-group am-fl">
            <button @click="handleAdd" type="button" class="btn-search am-btn am-btn-default am-btn-success">
              新增
            </button>
          </div>
          <div class="am-u-sm-12">
            <el-table
              :data="tableData"
              border
              maxHeight="600"
              empty-text="暂无数据"
              stripe
              style="min-width: 100%">
              <el-table-column
                prop="areaTeamName"
                label="区域">
              </el-table-column>
              <el-table-column
                prop="campusName"
                label="校区">
              </el-table-column>
              <el-table-column
                prop="status"
                label="状态">
                <template scope="scope">
                  <div>{{scope.row.status === '0' ?  '停用' : '启用'}}</div>
                </template>
              </el-table-column>
              <el-table-column
                prop="operatorName"
                label="最后操作人">
              </el-table-column>
              <el-table-column
                prop="updateTime"
                label="最后操作时间">
                <template scope="scope">
                  <div>{{scope.row.updateTime | formatTime}}</div>
                </template>
              </el-table-column>
              <el-table-column
                prop="areaTeamName"
                label="操作">
                <template scope="scope">
                  <el-button size="small" v-if="hasPermission('edit')" @click="handleEdit(scope.row)">编辑</el-button>
                  <el-button size="small" v-if="scope.row.status === '0' && hasPermission('enable_disable')" @click="handleChangeStatus(scope.row)">启用</el-button>
                  <el-button size="small" v-else-if="hasPermission('enable_disable')" @click="handleChangeStatus(scope.row)">停用</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
        <div class="am-u-lg-12 am-cf">
          <div class="am-fr">
            <pagination v-bind:total="total" v-bind:pageNo="pageNo" v-bind:pageSize="pageSize"
                        @paging="loadTableData"/>
          </div>
        </div>
      </div>
    </div>

  </div>
</template>
<script>
  import io from '../../lib/io'
  import CustomerToolbar from './CustomerToolbar.vue'
  import Pagination from '../base/Pagination.vue'
  import moment from 'moment'
  import ElButton from "../../../node_modules/element-ui/packages/button/src/button.vue";

  export default{
    data:function(){
      return {
        total: 0,
        pageSize: 10,
        pageNo: 1,
        tableData: [{}],
      }
    },
    components: {
      ElButton,
      CustomerToolbar, Pagination
    },
    watch: {

    },
    computed: {

    },
    mounted :function(){
      $(window).smoothScroll()
    },
    methods:{
      handleChangeStatus (list) {
        io.post(io.saveOrUpdateWorkSetupOfCampus, {
          workSetupTemplateId: list.workSetupTemplateId,
          workSetupOfCampusId: list.workSetupOfCampusId,
          areaTeamId: list.areaTeamId,
          remindConfig: list.remindConfig,
          campusId: list.busTeamId,
          status: list.status === '0' ? '1' : '0',
        }, (ret) => {
          if (ret.success) {
            this.$toast('更新成功！')
            this.loadTableData()
          } else {
            this.$alert(ret.desc)
          }
        })
      },
      handleAdd () {
        this.$router.push('/main/crm/smsForm?areaTeamId=' + this.$refs.toolbar.query.areaTeamId)
      },
      handleEdit (list) {
        this.$router.push('/main/crm/smsForm?info=' + JSON.stringify(list))
      },
      handleFind(formData) {
        this.formData = this.formatData(formData)
        this.loadTableData()
      },
      loadTableData: function () {
        this.$showLoading()
        io.post(io.workSetupOfCampus, this.formData, (ret) => {
          this.$hiddenLoading()
          if (ret.success) {
            this.tableData = ret.data
          } else {
            this.$alert(ret.desc)
          }
        })
      },
      formatData(data) {
        return {
          areaTeamId: data.areaTeamId,
          campusId: data.campusId,
        }
      }
    }
  }
</script>
<style lang="less" scoped>
</style>
